<template>
	<view>
		<u-form :model="form" ref="uForm" id="form-container" @submit.prevent="submit">
			<u-form-item label="工单单别" prop="feedbackOrderType" :label-width="labelWidth" required>
				<u-input v-model="form.feedbackOrderType"  @blur="PlanNoblur"/>
			</u-form-item>
			<u-form-item label="工单单号" prop="feedbackWorkOrderNo" :label-width="labelWidth" required>
				<u-input v-model="form.feedbackWorkOrderNo" @blur="PlanNoblur"/>
			</u-form-item>
			<!-- <u-form-item label-width="80">
				<u-button type="info" size="mini" @click="searchFeedbackPlanNo">查询排产序号</u-button>
			</u-form-item> -->
			<u-form-item label="排产序号" prop="feedbackPlanNo" :label-width="labelWidth">
				<u-input v-model="form.feedbackPlanNo"/>
			</u-form-item>
			<u-form-item label="机柜条码" prop="deviceBarcode" :label-width="labelWidth" required>
				<div class="u-flex u-flex-nowrap u-row-between">
				<u-input v-model="form.deviceBarcode" />
					<u-button type="success" size="mini" @click="scanFun">扫码</u-button>
				</div>
			</u-form-item>
			<!-- <u-form-item label="处理状态" label-width=150> -->
			    <u-radio-group v-model="radio" style="margin-left: 10rpx;">
			    	<u-radio shape="square" 
			    			 v-for="(item, index) in nameNumberList" 
			    			 :name="item" 
			    			 :key="index">
			    			 {{item}}
			    	</u-radio>
			    </u-radio-group>
				
			<!-- </u-form-item> -->
			        <u-form-item v-if="radio == '输入工号'" label="维修人员工号" prop="feedbackJobNumber" :label-width="labelWidth" required>
			        	<u-input v-model.trim="form.feedbackJobNumber" :disabled="radio != '输入工号'" @blur="changeJobNumber" placeholder="输入人员工号"/>
			        </u-form-item>
			        <u-form-item v-if="radio == '输入姓名'" label="维修人员姓名" prop="feedbackName" :label-width="labelWidth" required>
			        	<u-input v-model="form.feedbackName" placeholder="输入人员姓名" @blur="changeName" :disabled="radio != '输入姓名'"/>
			        </u-form-item>
			<!-- <u-form-item label="维修标准" prop="standard" :label-width="labelWidth">
				<u-input v-model="form.standard" :type="type" :auto-height="autoHeight" placeholder="请输入维修标准" />
			</u-form-item> -->
			<u-form-item label="工作中心" prop="workCenter" :label-width="labelWidth" required>
				<div class="u-flex u-flex-nowrap u-row-between">
				   <u-input v-model="form.workCenter" disabled/>
				   <u-button slot="right" type="success" :ripple="true" size="mini" @click="showworkCenter = true" class="machineBtn">选择工作中心</u-button>
				   <u-picker mode="selector" v-model="showworkCenter" :range="workCenterList" @confirm="workCenterconfirm"></u-picker>
				</div>
			</u-form-item>
			<u-form-item label="对应工序" prop="feedbackProcessOrder" :label-width="labelWidth" required>
				<div class="u-flex u-flex-nowrap u-row-between">
				   <u-input v-model="form.feedbackProcessOrder" disabled/>
				   <u-button slot="right" type="success" :ripple="true" size="mini" @click="showdeviclick" class="machineBtn">选择对应工序</u-button>
				   <u-select v-model="showdevi" :list="deviceBardcodeList" label-name="processOrder" @confirm="Bardcodesconfirm"></u-select>
				</div>
			</u-form-item>
			<u-form-item label="工序名称" prop="processName" :label-width="labelWidth" required>
				<div class="u-flex u-flex-nowrap u-row-between">
				   <u-input v-model="form.processName" disabled/>
				   <!-- <u-button slot="right" type="success" :ripple="true" size="mini" @click="showdeviceBardcodes = true" class="machineBtn">选择工序名称</u-button> -->
				   <!-- <u-select v-model="showdeviceBardcodes" :list="deviceBardcodeList" label-name="processName" @confirm="processNameconfirm"></u-select> -->
				</div>
			</u-form-item>	
			<u-form-item class="u-flex u-row-center">
				<u-button type="success" size="medium" @click="submit">提交</u-button>
			</u-form-item>
		</u-form>
		<u-modal :value="QJshow" title="器件条码存在非法字符" :content='qjContent'></u-modal>
		<u-top-tips ref="uTips"></u-top-tips>
	</view>
</template>

<script>
	import { saveFeedbackJobNumber,find_user,getPlanList,getPlanMachine,getWokeCenterList } from '../../../utils/index.js'
	export default {
		data() {
			return {
				QJshow: false,
				qjContent: '',
				nameNumberList: ['输入工号','输入姓名'],
				radio: '输入工号',
				showworkCenter: false,
				workCenterList:[],
				deviceBardcodeList:[],
				showdeviceBardcodes:false,
				showdevi: false,
				labelWidth: 160,		//表单每一项的宽度
				autoHeight: true,		//表单“描述”输入框自动高度
				type: 'textarea',		//将描述的输入框设置为textarea
				rules: {						//表单提交前的验证
					deviceBarcode: [{
							required: true, 
							message: '请输入内容', 
							trigger: 'blur',
					}],
					feedbackJobNumber: [{
							required: true, 
							message: '维修人员工号不能为空！', 
							trigger: 'blur',
					}],
					feedbackName: [{
							required: true, 
							message: '维修人员名字不能为空！', 
							trigger: 'blur',
					}],
					feedbackOrderType: [{
							required: true, 
							message: '工单单别不能为空！', 
							trigger: 'blur',
					}],
					feedbackWorkOrderNo: [{
							required: true, 
							message: '工单单号不能为空！', 
							trigger: 'blur',
					}],
					// feedbackPlanNo: [{
					// 		required: true, 
					// 		message: '排产序号不能为空！', 
					// 		trigger: 'blur',
					// }],
					feedbackProcessOrder: [{
							required: true, 
							message: '对应工序不能为空！', 
							trigger: 'blur',
					}],
					processName: [{
							required: true, 
							message: '工序名称不能为空！', 
							trigger: 'blur',
					}],
				},
				form: {},
				user: uni.getStorageSync('user'),
			}
		},
		methods:{
			showdeviclick(){
				if(!this.form.feedbackOrderType || !this.form.feedbackWorkOrderNo){
					return this.$refs.uTips.show({
						title: '请输入工单或者工别!',
						type: 'warning',
						duration: '2000'
					})
				}
				if(!this.deviceBardcodeList.length) {
				    return this.$refs.uTips.show({
						title: '该工单没获取到工序!',
						type: 'warning',
						duration: '2000'
					})
				}
				this.showdevi = true
			},
			// 工作中心先择
			workCenterconfirm(e){
				this.form.workCenter = this.workCenterList[e[0]]
			},
			// 工序顺序先择
			Bardcodesconfirm(e){
				this.form.feedbackProcessOrder = e[0].label
				this.deviceBardcodeList.forEach(item => {
					if(e[0].label == item.processOrder) {
						this.form.processName = item.processName
					}
				})
			},
			// 工序名称先择
			// processNameconfirm(e){
			// 	this.form.processName = e[0].label
			// 	this.deviceBardcodeList.forEach(item => {
			// 		if(e[0].label == item.processName) {
			// 			this.form.feedbackProcessOrder = item.processOrder
			// 		}
			// 	})
			// },
			// 工单失去焦点
			async PlanNoblur(){
				console.log(123);
				if(this.form.feedbackOrderType && this.form.feedbackWorkOrderNo){
					let query = {}
				     query = {
				    	orderType: this.form.feedbackOrderType,
				    	workOrderNo: this.form.feedbackWorkOrderNo,
				    	page: 1,
				    	limit: 1000
				    }
				    const {data} = await getPlanMachine(query)
				    console.log(data.data.List);
					if(!data.data.List.length){
						this.form.feedbackProcessOrder = ''
						this.form.processName = ''
					}
					this.deviceBardcodeList = data.data.List
				}
			},
			// 点击按钮，启用扫码
		    scanFun() {
		    	let that = this
		    	uni.scanCode({
		    		onlyFromCamera: true,
		    		success: function (res) {
						// if(res.result.includes('06S')){that.form.deviceBarcode = res.result.match(/06S(\S*)1P/)[1]}
		    			that.form.deviceBarcode = res.result
		    		},
		    		fail() {
		    			console.log('识别失败')
		    		}
		    	})
		    },
			// 表单验证
			submit() {
				this.$refs.uForm.validate(valid => {
					if (valid) {
						console.log('验证通过')
						this.postForm()
					} else {
						this.$refs.uTips.show({
							title: '请完善表单数据!',
							type: 'warning',
							duration: '2000'
						})
					}
				})
			},
			// 提交整个表单，提交按钮绑定的函数
			async postForm(val) {
				let query = Object.assign({},this.form)
				query.sponsorJobNumber = this.user.jobNumber
				query.sponsorName = this.user.userName
				if(query.isCraft) { delete query.isCraft }
				if(query.deviceBarcode.includes('06S')){query.deviceBarcode = query.deviceBarcode.match(/06S(\S*)1P/)[1]}
				if(!/^[0-9a-zA-Z[)>-]+$/.test(query.deviceBarcode)) {
					this.QJshow = true
					this.qjContent = this.form.deviceBarcode
					return
				}
				let { data } = await saveFeedbackJobNumber(query)
				if(data.code == '1') {
					this.$refs.uTips.show({
						title: '提交成功！',
						type: 'success',
						duration: '2000'
					})
					setTimeout(
						uni.redirectTo({
						    url: '../../login/login'
					}), 2000)
				} else {
					this.$refs.uTips.show({
						title: data.msg,
						type: 'error',
						duration: '2000'
					})
				}
			},
			async changeName(val) {
				if(!val) return
				let query = {
					userName: this.form.feedbackName
				}
				let { data } = await find_user(query)
				if(data.data) {
					this.$set(this.form,'feedbackJobNumber',data.data.jobNumber)
					// this.form.feedbackJobNumber = data.data.jobNumber
					this.$refs.uTips.show({
						title: `查询成功！姓名：${data.data.userName},  工号：${data.data.jobNumber}`,
						type: 'success',
						duration: '2000'
					})
				} else {
					this.$set(this.form,'feedbackName','')
					this.$set(this.form,'feedbackJobNumber','')
					this.$refs.uTips.show({
						title: '查询失败',
						type: 'error',
						duration: '2000'
					})
				}
			},
			async changeJobNumber(val) {
				if(!val) return
				let query = {
					jobNumber: this.form.feedbackJobNumber
				}
				let { data } = await find_user(query)
				if(data.data) {
					this.$set(this.form,'feedbackName',data.data.userName)
					// this.form.feedbackName = data.data.userName
					this.$refs.uTips.show({
						title: `查询成功！姓名：${data.data.userName},  工号：${data.data.jobNumber}`,
						type: 'success',
						duration: '2000'
					})
				} else {
					this.$set(this.form,'feedbackName','')
					this.$set(this.form,'feedbackJobNumber','')
					this.$refs.uTips.show({
						title: '查询失败',
						type: 'error',
						duration: '2000'
					})
				}
			},
			async searchFeedbackPlanNo(){
				if(!this.form.feedbackOrderType) return this.$refs.uTips.show({
					title: '工单单别不能为空!',
					type: 'error',
					duration: '2000'
				})
				if(!this.form.feedbackWorkOrderNo) return this.$refs.uTips.show({
					title: '工单单号不能为空!',
					type: 'error',
					duration: '2000'
				})
				let query = {
					orderType: this.form.feedbackOrderType,
					workOrderNo: this.form.feedbackWorkOrderNo,
				}
				let {data} = await getPlanList(query)
				console.log('排产编号')
				if(data.code == '1') {
					this.form.feedbackPlanNo = data.data.records[0].planNo
				} else {
					this.$refs.uTips.show({
						title: data.msg,
						type: 'error',
						duration: '2000'
					})
				}
			}
		},
		async onLoad() {
			const {data} = await getWokeCenterList()
			this.workCenterList = data.data
			this.form.workCenter = uni.getStorageSync('user').departmentName
		},
		// 必须要在onReady生命周期，因为onLoad生命周期组件可能尚未创建完毕
		onReady() {
			this.$refs.uForm.setRules(this.rules);
		}
	}
</script>

<style>
	.main-content {
		width: 100%;
	}
	#form-container ::v-deep .u-form-item {
		margin-top: 15rpx;
		padding: 10rpx 30rpx;
	}
	.content {
		padding: 24rpx;
		text-align: center;
	}
	.buttonGap {
		margin-top: 20rpx;
	}
</style>
